<template>
	<view>
		<view class="form_con">
			<view class="con">
				<text>{{$t('name')}}：</text>
				<view>
					<input :placeholder="$t('name_alert')" @input="iName" :value='ma_name' maxlength="30" />
				</view>
			</view>
			<view class="con">
				<text>{{$t('mobile')}}：</text>
				<view>
					<input :placeholder="$t('mobile_alert')" @input="iPhone" :value='ma_phone' maxlength="20" />
				</view>
			</view>
			<view class="con">
				<text>{{$t('address')}}：</text>
				<view>
					<input :placeholder="$t('address_alert')" @input="iAddress" :value='ma_address' maxlength="100" />
				</view>
			</view>
		</view>
		<view class="btn_two">
			<view class="btn_obtain" @click="funSubmit">
				{{$t('submit')}}
			</view>
			<view class="btn_obtain" @click="funDelete">
				{{$t('delete')}}
			</view>
		</view>
		<!--刷新-->
		<view class='loadind_con' v-if="isLoading">
			<view class="loading">
				<view class="loading-bar"></view>
				<view class="loading-bar"></view>
				<view class="loading-bar"></view>
				<view class="loading-bar"></view>
			</view>
		</view>
	</view>
</template>

<script>
	import valid from '../../../static/valid.js';

	export default {
		data() {
			return {
				isLoading: true, //是否正在加载
				id: 0, //主键id
				ma_address: '', //地址 - 详细
				ma_name: '', //姓名
				ma_phone: '', //手机
			}
		},
		onLoad(options) {
			var _this = this;
			_this.id = options.id;

			//获取详情
			_this.fun_request("/Api/MemberAddress/Get", {
				id: _this.id
			}, function(res) {
				var _detail = res.data;
				_this.ma_phone = _detail.ma_phone;
				_this.ma_name = _detail.ma_name;
				_this.ma_address = _detail.ma_address;

				//加载完成
				_this.isLoading = false;
			});
		},
		methods: {
			iName(e) { //文本框 - 姓名
				this.ma_name = e.detail.value;
			},
			iPhone(e) { //文本框 - 手机
				this.ma_phone = e.detail.value;
			},
			iAddress(e) { //文本框 - 地址
				this.ma_address = e.detail.value;
			},
			funSubmit() { //提交反馈
				let _this = this;
				//验证
				if (_this.fun_validate(_this.ma_name.isNull(), "请输入姓名") ||
					_this.fun_validate(_this.ma_phone.isNull(), "请输入手机号") ||
					_this.fun_validate(_this.ma_address.isNull(), "请输入详细地址")) {
					return true;
				}
				_this.isLoading = true;
				_this.fun_request("/Api/MemberAddress/Modify", {
					ma_id: _this.id,
					ma_name: _this.ma_name,
					ma_phone: _this.ma_phone,
					ma_address: _this.ma_address
				}, function(json) {
					_this.fun_showToast(json.msg);
					if (json.code == 0) {
						//静态更新
						uni.$emit('load_list_address', {
							msg: '页面更新'
						});
						uni.navigateBack();
					}
					_this.isLoading = false;
				});
			},
			funDelete() { //删除
				let _this = this;

				_this.fun_showModal("确定删除吗？", function() {
					_this.isLoading = true;
					_this.fun_request("/Api/MemberAddress/Delete", {
						id: _this.id
					}, function(json) {
						_this.fun_showToast(json.msg);
						if (json.code == 0) {
							//静态更新
							uni.$emit('load_list_address', {
								msg: '页面更新'
							});
							uni.navigateBack();
						}
						_this.isLoading = false;
					}, false, function(json) {
						_this.fun_showToast(json.msg);
					});
				});
			},
		}
	}
</script>

<style>
	page {
		background: #F7F7F7;
	}

	.form_con {
		display: block;
		width: 100%;
		margin-top: 30rpx;
		background-color: #fff;
	}

	.form_con .con {
		margin: 0 0 0 3%;
		overflow: hidden;
		height: 100rpx;
		line-height: 100rpx;
		border-bottom: 1px solid #eee;
	}

	.form_con .con text {
		float: left;
		width: 150rpx;
		font-size: 30rpx;
	}

	.form_con .con:last-child {
		border: 0;
	}

	.form_con .con view {
		display: block;
		padding-left: 150rpx;
	}

	.form_con .con view input {
		margin: 0;
		padding: 0;
		width: 100%;
		height: 100rpx;
		line-height: 100rpx;
		font-size: 30rpx;
		color: #666;
	}

	.form_con .con view label {
		color: #666;
	}
</style>
